Newsletter Content Editing

Here we list out the different content editing options in Newsletters.

The Toolbar

The toolbar contains the following option icons:

newsletterimage12

  1. Toggle component visibility - The gridlines and borders around elements are shown by default. You can use this button to hide these from view.
  2. View the newsletter in full screen.
  3. View HTML code – Use this to show the HTML code for the newsletter you have created. You can then copy and paste this into a notepad document and save this outside of the platform if you wish.
  4. Import HTML code – Use this to copy and paste in HTML code. Please note, if you import HTML copied from sources other than newsletters created in the site, they may not behave the same as those created in the newsletter tool.
  5. Toggle image visibility – Images which have been added to the newsletter are shown by default. You can use this button to hide the images.
  6. Undo.
  7. Re-do.
  8. Delete all: This clears the current newsletter content. Once you have added a new element the previous content is overwritten.
  9. Choose from existing template.
    newsletterimage13

  10. Open Style Manager: This is where you can access formatting options for elements, such as changing the size, font or colour of text blocks and headings.
  11. Open Options Manager: Use this to set the URL for links and buttons you have added.
  12. Open Layers Manager: This allows you to hide individual components and change the order in which they appear on the page.
  13. Open Blocks View: This opens up the menu of drag and drop blocks that you can add to the newsletter canvas.

Adding Content

To add content to newsletters, select from the blocks on the right of the page. You can build a newsletter from scratch by adding in sections and content, or you can choose an existing template and add or remove blocks to customise this.

Page layout

Sections allow you to structure the page – you can nest different section blocks together to get the structure you want.

You can (and should) nest sections one inside the other, e.g. you might have a 1 section container with another 1 section container, then a title, then a 1/2 section (see example below).

newsletterimage14

Content

There are blocks for sections (which you use to create the layout); page components such as text; images and text sections; and headers.

Content blocks can then be dragged into the sections.

Aligning content 

The best way to align an image is to first create a “Section” component (1, ½, 1/3 or 3/7), then drag an image component into it. Then select the cell containing the image by clicking on it, opening the Style Manager and selecting the appropriate align from the “Text align” section of the “Typography” menu.

Creating text boxes

Pasting can be performed by first dragging a “Text” component into the editing area, double clicking its text to activate “edit” mode and then pasting content into it. To make sure you don’t retain unwanted formatting, you might want to copy and paste via a text editor like Notepad first.

 newsletterimage15

 

Lists

There are 4 types of lists: picture grid; picture list; numbered and bulleted.

 newsletterimage16

 

Headings

Headings can be added to create sections. The available heading levels are H1, H2 & H3.

These will default to your site’s main theming colour but can be changed in the Style Manager. H1 is the biggest and H3 is the smallest.

 newsletterimage17

 

Formatting

  • To change the formatting on each element, you need to select that particular element and apply the formatting you want.

Click on the ‘formatting’ button to open the formatting menu

  • You can then change the size, font settings and text decoration for selected content/sections.

Changing the size of content or blocks

You can change the width or height of an element either by specifying the size in pixels or the size it should be in proportion to the section it sits within. Click into another block after you’ve finished editing a setting for it to update.

newsletterimage18

Creating links

  • To create a link please select the text you want to use for the link. A box will appear right above it, with some buttons. The rightmost one will turn the selected text into a link. To configure the target for the link use the “Options Manager” (cogwheel button in the top right corner). Alternatively, a “Link” component can be dragged in the editor.

newsletterimage19

Editing Content Blocks

When you select a block of content – e.g. an item in a list, a block of text or a section heading, you have a bunch of options:

newsletterimage20